
<!DOCTYPE html>
<!--suppress ALL -->
<html lang="zh-cn">
<!--<html lang="en" xmlns:th="http://www.thymeleaf.org">-->
<head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>

    <title >导入记录</title>

    <link rel="stylesheet" type="text/css" href="/src/css/themes/default.css"/>
    <!-- iview样式 -->
    <link rel="stylesheet" type="text/css" href="/plugins/iview/css/iview.css"/>
    <!--@import url("//unpkg.com/iview/dist/styles/iview.css");-->
    <!--<link rel="stylesheet" type="text/css" href="//unpkg.com/iview/dist/styles/iview.css"/>-->
    <!-- 引入layui样式 -->
    <link rel="stylesheet" href="/plugins/layui/css/layui.css" media="all"/>
    <link rel="stylesheet" href="/plugins/popover/popover.css">
    <!--   <script src="//unpkg.com/vue/dist/vue.js"></script>
       <script src="//unpkg.com/iview/dist/iview.min.js"></script>-->
    <!-- 引入vue -->
    <script type="text/javascript" src="/plugins/vue/vue.min.js"></script>
    <!-- iview js -->
    <script type="text/javascript" src="/plugins/iview/js/iview.js"></script>
    <script src="/properties/config.js"></script>
    <!--引入layui.js-->
    <script src="/plugins/layui/layui.js"></script>
    <!--引入axios.js 用于ajax调用-->
    <script src="/plugins/axios/axios.min.js"></script>
    <script type="text/javascript" src="/plugins/jquery-1.9.1.min.js"></script>
    <script src="/build/js/appToken.js"></script>
    <script src="/plugins/popover/popover.js"></script>
</head>
<body>
<!--隐藏元素-->
<!--<p id="staffType"  th:attr="value=${staffType}"  hidden />-->
<!--使用v-cloak技术，在vue渲染完毕前隐藏页面，渲染完成后显示-->
<div id="app" v-cloak>
        <!-- 搜索工具框 开始-->
        <row style="padding: 10px">
            <i-col span="24">
                <Card>
                    <p slot="title">
                        <Icon type="ios-search"></Icon>
                        搜索条件
                    </p>
                    <!--右上侧按钮列表-->
                    <i-button  slot="extra" type="info"  icon="ios-search" @click="toLoading" style="margin-right:10px">
                        <span >查询</span>
                    </i-button>
                    <i-button  slot="extra"  @click="handleReset('searchForm')" style="margin-right:10px">
                        <span>重置</span>
                    </i-button>

                    <!--查询表单内容-->
                    <row :gutter="16">
                        <i-form ref="searchForm"  :model="searchForm"   label-position="right" :label-width="100">

                            <i-col span="6">
                                <form-item label="表格名称：" prop="tableName">
                                    <i-input v-model="searchForm.tableName" placeholder="可模糊查询" maxlength="30" ></i-input>
                                </form-item>
                            </i-col>
                        </i-form>
                    </row>
                </Card>
            </i-col>
        </row>

    <Modal
            v-model="uploadSalaryModel"
            title="上传文件"
            :mask-closable="false"
            :width="600">
        <i-form ref="uploadSalarySetForm" :model="uploadSalarySetForm" :rules="uploadSalarySetFormValidate"  :label-width="150"  >

            <form-item label="选择时间："  prop="timeYearMonth">
                <date-picker v-model="uploadSalarySetForm.timeYearMonth" type="month" placeholder="选择年月" style="width: 300px"></date-picker>
            </form-item>
            <form-item label="选择模板："  prop="templateCode">
                <i-select v-model="uploadSalarySetForm.templateCode"   style="width: 300px">
                    <i-option v-for="item in templateList" :value="item.templateCode" :key="item.templateName">{{ item.templateName }}</i-option>
                </i-select>
            </form-item>
<!--             <form-item label="上传方式：" prop="uploadType">
                <radio-group v-model="uploadSalarySetForm.uploadType" size = "large" >
                    <radio  label="新增导入"></radio>
                    <radio  label="关联导入"></radio>
                </radio-group>
            </form-item> -->

            <form-item label="上传文件：" prop="uploadSalaryFile" id = "uploadSalaryFile">
                <upload
                        ref="upload"
                        type="select"
                        :format="['xls','xlsx']"
                        :before-upload="beforeUpLoadFile"
                        :on-remove="removeFile"
                        action="">
                    <div style="padding: 20px 0">
                        <icon type="ios-cloud-upload" size="40" style="color: #3399ff"></icon>
                        <p>支持模板导出excel扩展名：xlsx</p>
                    </div>
                </upload>
            </form-item>
        </i-form>


        <div slot="footer" style="text-align:left">
            <i-button type="primary" @click="beforeUpload">
                <span >上传</span>
            </i-button>
            <i-button type="ghost" @click="closeUploadSalaryModal" style="margin-left: 8px;background-color:rgba(255, 153, 0, 1);color:#ffffff">撤销</i-button>
        </div>


    </Modal>

        <row style="padding: 10px">
            <i-col span="24">
                <Card>
                    <i-button  @click="uploadInitData" style="margin-right:10px" type="primary">
                        <span>导入数据</span>
                    </i-button>
                </Card>
            </i-col>
        </row>


        <!-- 搜索工具框 结束-->
        <!-- 表单Grid，使用layerUI的表格组件 开始 -->
        <row style="padding: 10px">
            <i-col span="24">
                <!-- 使用方法渲染模式 -->
                <table id="listTable" lay-filter="listTable" class="layui-hide"> </table>
                <script type="text/html" id="barTools">
                    <a class="layui-btn layui-btn-warm layui-btn-xs " lay-event="dataCheck" ht-auth="dataCheck">审核</a>
                    <a class="layui-btn layui-btn-normal layui-btn-xs " lay-event="info" ht-auth="info">详情</a>
                    <a class="layui-btn layui-btn-danger layui-btn-xs " lay-event="delete" ht-auth="delete">删除</a>
                </script>

            </i-col>
        </row>


</div>
<script type="text/html" id="checkState">
    {{#  if(d.state === 0){ }}
    <span style="color: #F5161C;">{{ "未审核" }}</span>
    {{#  } else { }}
    {{ "已审核" }}
    {{#  } }}
</script>
<script src="/src/js/comm.js" ></script>
<script src="/src/js/dataImport/dataInfo.js" ></script>
</body>
</html>